<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 1.编写代码，从文档（document）中获取带有 data-widget-name特性（attribute）的元素，并读取它的值。 -->
		
		<!DOCTYPE html>
		<html>
		<body>
		
		  <div data-widget-name="menu">Choose the genre</div>
		
		  <script>
			//获取id这个元素
			//获取它 querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。
			let menu = document.querySelector('[data-widget-name]');
			//读取值
			//console.log((menu.dataset.widgetName));
			//读取值 getAttribute() 方法返回指定属性名的属性值。【 data-widget-name：属性名】  【menu：属性值】
			console.log(menu.getAttribute('data-widget-name'));//返回data-widget-name属性名/元素 的属性值menu
		  </script>
		</body>
		</html>
	</body>
</html>
